<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
    <div id="app" v-cloak>
      <input type="text" v-model="num1" placeholder="请输入第1个数字"/>
      <select v-model="sel">
        <option value="+">+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
      </select>
      <input type="text" v-model="num2" placeholder="请输入第2个数字"/>
      <input type="button" value="=" @click="btn"/>
      <input type="text" v-model="res"/>
    </div>
	</head>
	<body>
    <script src="vue.js"></script>
    <script>
      var vm=new Vue({
        el:'#app',
        data:{
          num1:null,
          sel:'+',
          num2:null,
          res:null
        },
        methods:{
          btn(){
            if(this.sel=="+"){
              this.res=parseInt(this.num1)+parseInt(this.num2)
            }else if(this.sel=='-'){
              this.res=parseInt(this.num1)-parseInt(this.num2)
            }else if(this.sel=='*'){
              this.res=parseInt(this.num1)*parseInt(this.num2)
            }else {
              this.res=parseInt(this.num1)/parseInt(this.num2)
            }
          }
        }
      })
    </script>
	</body>
</html>
